let arr1 = []
let adds = document.querySelectorAll('.add')
let subs = document.querySelectorAll('.sub')
let prices = document.querySelectorAll('.price')
let ins = document.querySelectorAll('input')
let zj = document.querySelector('.zj')
let js = document.querySelector('.js')
prices.forEach(function(a,i){
    arr1.push(prices[i].textContent)
})
function sum(){
    let s = 0;
    let j = 0;
    ins.forEach(function(a,i){
        s += Number(ins[i].value) 
        j += Number(ins[i].value) * Number(prices[i].textContent) 
    })
    return [s,j]
}
adds.forEach(function(a,i){
    a.addEventListener('click',function(){
        ins[i].value = Number(ins[i].value)+1
        zj.textContent =  sum()[1]
        js.textContent =  sum()[0]
    })
})
subs.forEach(function(a,i){
    a.addEventListener('click',function(){
        ins[i].value = Number(ins[i].value)-1
        if(ins[i].value < 0){
            ins[i].value = 0
        }
        zj.textContent =  sum()[1]
        js.textContent =  sum()[0]
    })
})
ins.forEach(function(a,i){
    a.addEventListener('input',function(){
        ins[i].value = parseInt(ins[i].value) 
        zj.textContent =  sum()[1]
        js.textContent =  sum()[0]
    })
})